<template>
  <el-container class="home-con">
    <!-- <el-header>
      <div class="logo-img">
        <img src="@/assets/img/logo1.png" alt="" />
        <span></span>
      </div>
      <div class="avatar">
        <el-button class="loginout" @click="loginout" type="warning"
          >退出</el-button
        >
      </div>
    </el-header> -->
    <el-container>
      <el-aside width="200px">
        <div class="logo">
          <div class="logo-img">
            <img src="@/assets/img/logo1.png" alt="" />
            <span></span>
          </div>
        </div>
        <!-- 侧边导航栏 -->
        <el-menu
          router
          background-color="#333744"
          text-color="#A0AEC0"
          active-text-color="#409eff"
          unique-opened
          :default-active="acitvePath"
          collapse-transition
        >
          <el-submenu
            :index="item.id"
            v-for="item in navdata"
            :key="item.id + ''"
          >
            <template slot="title">
              <i :class="iconslist[item.id]"></i>
              <span>{{ item.nameZh }}</span>
            </template>
            <el-menu-item
              :index="subitem.path"
              v-for="subitem in item.children"
              :key="item.index"
              @click="highlight(subitem.path)"
            >
              <template slot="title">
                <span>{{ subitem.nameZh }}</span>
              </template>
            </el-menu-item>
          </el-submenu>
        </el-menu>
        <div class="bottom">
          <router-link style="color: #a0aec0" :to="{ name: 'choose' }"
            >选择身份</router-link
          >
          <p>{{ seting.title1 }}</p>
          <p>{{ seting.title2 }}</p>
        </div>
      </el-aside>
      <el-main>
        <!--  -->
        <avatar />
        <router-view></router-view> </el-main
    ></el-container>
  </el-container>
</template>

<script>
import avatar from "@/components/avatae/avatar.vue";
import "@/assets/css/iconfont.css";
import HTTP from "@/service/http";
export default {
  components: { avatar },
  data() {
    return {
      seting: {
        title1: "获得帮助",
        title2: "设置",
      },
      acitvePath: "",
      iconslist: {
        2: "iconfont icon-yonghu",
        3: "iconfont icon-icon",
        4: "iconfont icon-iconfontjixieqimo",
        5: "iconfont icon-zhexiantu",
      },
      isCollapse: true,
      navdata: [
        {
          id: "1000",
          path: "/upload",
          nameZh: "企业上传",
          parentId: 2,
          children: [
            {
              id: "21",
              path: "/upload",
              name: "Profile",
              nameZh: "upload",
              iconCls: null,
              parentId: "44",
              children: null,
            },
          ],
        },
        {
          id: "1",
          path: "/index",
          nameZh: "首页概况",
          parentId: 0,
          children: null,
        },
        {
          id: "2",
          path: "/retail",
          name: "retail",
          nameZh: "网络零售",

          parentId: 1,
          children: [
            {
              id: "21",
              path: "/retail",
              name: "Profile",
              nameZh: "总体概况",
              iconCls: null,
              parentId: "44",
              children: null,
            },
            {
              id: "22",
              path: "/Physicalanalysis",
              name: "Role",
              nameZh: "实物行业分析",
              iconCls: null,
              parentId: "42",
              children: null,
            },
            {
              id: "23",
              path: "/noPhysicalanalysis",
              name: "noPhysicalanalysis",
              nameZh: "非实物行业分析",
              iconCls: null,
              parentId: "13",
              children: null,
            },
            {
              id: "24",
              path: "/Platformanalysis",
              name: "Platformanalysis",
              nameZh: "平台分析",
              iconCls: null,
              parentId: "14",
              children: null,
            },
          ],
        },
        {
          id: "3",
          path: "/ecompro",
          name: "Content",
          nameZh: "三农电商",
          iconCls: "el-icon-tickets",
          parentId: 4,
          children: [
            {
              id: 31,
              path: "/ecompro",
              name: "Department",
              nameZh: "农产品网络零售",
              iconCls: null,
              parentId: 41,
              children: null,
            },
            {
              id: 32,
              path: "/ecomcapital",
              name: "Student",
              nameZh: "农资网络零售",
              iconCls: null,
              parentId: 42,
              children: null,
            },
          ],
        },
        {
          id: "4",
          path: "/maeketcompany",
          name: "System",
          nameZh: "市场主体",
          iconCls: "el-icon-s-tools",
          parentId: 5,
          children: [
            {
              id: 41,
              path: "/maeketcompany",
              name: "Run",
              nameZh: "网络零售企业库",
              iconCls: null,
              parentId: 51,
              children: null,
            },
            {
              id: 42,
              path: "/marketshop",
              name: "Data",
              nameZh: "网络零售店铺库",
              iconCls: null,
              parentId: 52,
              children: null,
            },
          ],
        },
        {
          id: "5",
          path: "/analyse",
          name: "Link",
          nameZh: "直播分析",
          iconCls: null,
          parentId: 53,
          children: [
            {
              id: 51,
              path: "/totalanalyse",
              name: "Run",
              nameZh: "总体概况",
              iconCls: null,
              parentId: 55,
              children: null,
            },
            {
              id: 52,
              path: "/platanalyse",
              name: "Data",
              nameZh: "平台分析",
              iconCls: null,
              parentId: 59,
              children: null,
            },
          ],
        },
        {
          id: "6",
          nameZh: "数字大屏",
          path: "/fullpage",
          name: "fullpage",
        },
        {
          id: "7",
          path: "/admingl",
          name: "Link",
          nameZh: "后台管理",
          iconCls: null,
          parentId: 53,
          children: [
            {
              id: 71,
              path: "/admingl",
              name: "Run",
              nameZh: "用户管理",
              iconCls: null,
              parentId: 70,
              children: null,
            },
            {
              id: 72,
              path: "/adminuser",
              name: "Data",
              nameZh: "角色管理",
              iconCls: null,
              parentId: 80,
              children: null,
            },
            {
              id: 73,
              path: "/department",
              name: "Data",
              nameZh: "部门管理",
              iconCls: null,
              parentId: 90,
              children: null,
            },
            {
              id: 74,
              path: "/authority",
              name: "Data",
              nameZh: "权限管理",
              iconCls: null,
              parentId: 90,
              children: null,
            },
          ],
        },
        {
          id: "8",
          path: "/admingl",
          name: "Link",
          nameZh: "企业管理",
          iconCls: null,
          children: [
            {
              id: 81,
              path: "/accountmanagement",
              name: "Run",
              nameZh: "账号管理",
              iconCls: null,
              children: null,
            },
            {
              id: 82,
              path: "/info",
              name: "Data",
              nameZh: "信息管理",
              iconCls: null,
              children: null,
            },
            {
              id: 83,
              path: "/person",
              name: "Data",
              nameZh: "从业管理",
              iconCls: null,
              children: null,
            },
            {
              id: 85,
              path: "/store",
              name: "Data",
              nameZh: "店铺管理",
              iconCls: null,
              children: null,
            },
            {
              id: 86,
              path: "/channel",
              name: "Data",
              nameZh: "渠道管理",
              iconCls: null,
              children: null,
            },
            {
              id: 87,
              path: "/maintain",
              name: "Data",
              nameZh: "商品维护",
              iconCls: null,
              children: null,
            },
          ],
        },
        {
          id: "9",
          nameZh: "企业上报",
          path: "/datareport",
          name: "fullpage",
          children: [
            {
              id: 92,
              path: "/datareport",
              name: "Data",
              nameZh: "数据上报",
              iconCls: null,
              parentId: 59,
              children: null,
            },
          ],
        },
        {
          id: "10",
          nameZh: "运营管理",
          path: "",
          name: "fullpage",
          children: [
            {
              id: 92,
              path: "/service",
              name: "Data",
              nameZh: "服务管理",
              iconCls: null,
              parentId: 59,
              children: null,
            },
            {
              id: 92,
              path: "/opinfo",
              name: "Data",
              nameZh: "人才服务",
              iconCls: null,
              parentId: 59,
              children: null,
            },
            {
              id: 92,
              path: "/policy",
              name: "Data",
              nameZh: "政策管理",
              iconCls: null,
              parentId: 59,
              children: null,
            },
            {
              id: 92,
              path: "/feedback",
              name: "Data",
              nameZh: "反馈管理",
              iconCls: null,
              parentId: 59,
              children: null,
            },
            {
              id: 92,
              path: "/ModuleIV",
              name: "Data",
              nameZh: "沟通申请信息管理",
              iconCls: null,
              parentId: 59,
              children: null,
            },
          ],
        },
      ],
    };
  },
  created() {
    this.acitvePath = window.sessionStorage.getItem("avtivePath");
  },
  mounted() {},

  methods: {
    highlight(acitvePath) {
      window.sessionStorage.setItem("activePath", acitvePath);
      this.acitvePath = acitvePath;
    },
    loginout() {
      this.$confirm("你是否要退出登录?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          setTimeout(() => {
            this.$router.push("/login");
            window.sessionStorage.removeItem("token");
            window.location.reload();
          }, 500);
        })
        .catch((err) => err);
    },
  },
};
</script>

<style lang="less" scoped>
.el-header {
  background-color: #333744;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 0;
  font-size: 20px;
  color: #fff;
  > div {
    display: flex;
    align-items: center;
    span {
      margin-left: 15px;
    }
  }
}
.el-aside {
  background-color: #333744;
  width: 200px;
  position: relative;
}
.home-con {
  height: 100vh;

  .logo-img {
    padding: 10px 15px;
    img {
      width: 150px;
      height: 40px;
    }
  }
}
.iconfont {
  margin-right: 10px;
}

.el-menu {
  border-right: none;
}
.el-menu-vertical-demo:not(.el-menu--collapse) {
  width: 200px;
  min-height: 400px;
}
.bottom {
  position: absolute;
  left: 20%;
  bottom: 5%;
  color: #a0aec0;
}
.el-main {
  margin: 0;
  padding: 0;
}
</style>
